import React, { useEffect, useState } from 'react'
import './index.css'
import {Link} from 'react-router-dom'
import {getshopinfo} from '../../../api/request'

export default function Shopinfo() {
    const [shopinfo,setShopinfo]=useState([])
    useEffect(()=>{
        (async()=>{
            let {data}=await getshopinfo()
           
            setShopinfo(data)
        })()
    })
  return (
    <div className='shopinfo'>
        {
            shopinfo.map(item=>(
                <Link
                to={
                    {
                        pathname:'/detail',
                        search:`id=${item.id}`
                    }
                }
                key={item.id}
                style={{display:'block'}}
                >
                             <div className='shopinfo-box'>     
             <div>
        <span>
            <img src={item.images}alt="" />
        </span>
      </div>
      <p>{item.title}</p>
      <h3>{item.price}</h3>
        </div>
                </Link>
         
               
             
            ))
        }
     
     
    </div>
  )
}
